If you have any questions that are beyond the scope of this documentation, please feel free to email or contact us via my page.
Highdmin is a fully featured premium admin template built on top of awesome Bootstrap 4.1.3, modern web technologies HTML5, CSS3 and jQuery. The theme includes beautiful dashboards including many ready to use hand crafted components. The components can be used very easy on any page. The theme is fully responsive and customizable.
We really care for our buyers and so in case if you have any question or feedback, please feel free to get back to us.
I have tried to follow the standards and modular structure while developing the theme. Following sections are explaining the theme File & Folder, structure, html file struture and plugins.
Admin/plugins/ │ └── The plugins files - which are not available through bower ├── html files Src/assets/ ├── scss/ │ └── All SCSS files ├── css/ │ └── All css files. ├── fonts/ ├── pages/ │ └── All the pages related scripts ├── images/ │ └── All images └── js/ └── All common Javascripts files
Scss is a CSS pre-processor and it extends the CSS language, adding features that allow variables, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable. Scss runs inside Node, in the browser and inside Rhino.
Files are explained below:
File | Description |
---|---|
bootstrap.css
|
Highdmin uses the bootstrap v4.1.3. The core bootstrap file is being used in all the pages. |
icons.scss /icons.css
|
Combines various font icons. You should remove the fonts you don't plan to use from this file and recompile it. |
style.scss /style.css
|
This is main style file. The scss version is importing all the custom scss files. Each of the scss file is containing style for speicic element. E.g Buttons, checkbox, icons, forms, etc. |
style_dark.scss /style_dark.css
|
If you would like to have a dark sidebar(dark background), please include this file.Remove the style.css from it. |
style_cl.scss /style_cl.css
|
If you would like to have a center logo, please include this file.Remove the style.css from it. |
Minton uses jQuery, Bootstrap JS framework(at its core) and some of the third-party plugins. There are may more third party plugin which you can use according to your needs. The css is already containing matching style for these plugins so you will not need to do anything around it.
Files are explained below:
File | Description |
---|---|
jquery.js , bootstrap.js ,
jquery.slimscroll , etc.
|
These files are used at core of the theme. |
jquery.app.js
|
This is a main js file. It contains the custom JS code needed for features including layout, sidebar, etc. Also it contains the definition of some of the key components (e.g. notifications, portlet, etc) and code (for self-initialization) related to some of the controls (e.g. modal, range-slider, switchery, multiselect, etc). |
pages/*.js
|
These are the files containing pages specific code. They are mainly used for demo purpose. |
../plugins/**.js
|
All supported and integrated third-party plugins are included in here. |
The theme contains various utilies including some helper classes, widgets, etc. Please see below some helper classes.
Helper Classes:
Class | Description |
---|---|
.m-t-50 | Adds 50px top margin |
.m-b-30 | Adds 30px bottom margin |
.w-xs | Minimum width 80px |
.w-sm | Minimum width 95px |
.w-md | Minimum width 110px |
.w-lg | Minimum width 140px |
.font-light | Font weight 300 |
.font-normal | Font weight normal |
.font-600 | Font weight 600 |
.font-bold | Font weight bold(700) |
.font-13 | Font size 13px |
.font-14 | Font size 14px |
.font-15 | Font size 15px |
.font-16 | Font size 16px |
.font-18 | Font size 18px |
.bx-shadow | box shadow - 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02) |
.bx-shadow-lg | bos shadow - 0 0 24px 0 rgba(0, 0, 0, 0.15), 0 1px 0 0 rgba(0, 0, 0, 0.1) |
.bx-shadow-none | Remove box shadow |
Plugin | Plugin CSS | Plugin js | Custom js |
---|---|---|---|
autocomplete | - | jquery.mockjax.js, jquery.autocomplete.min.js, countries.js | jquery.autocomplete.init.js |
autoNumeric | - | autoNumeric.js | - |
bootstrap-colorpicker | bootstrap-colorpicker.min.css | bootstrap-colorpicker.min.js | jquery.form-pickers.init.js |
bootstrap-filestyle | - | bootstrap-filestyle.min.js | - |
bootstrap-fileupload | bootstrap-fileupload.css | bootstrap-fileupload.js | - |
bootstrap-maxlength | - | bootstrap-maxlength.js | - |
bootstrap-select | bootstrap-select.min.css | bootstrap-select.min.js | - |
bootstrap-datepicker | bootstrap-datepicker.min.css | bootstrap-datepicker.min.js | jquery.form-advanced.init.js |
bootstrap-daterangepicker | daterangepicker.css | daterangepicker.js | jquery.form-advanced.init.js |
bootstrap-inputmask | - | bootstrap-inputmask.min.js | - |
bootstrap-sweetalert | sweet-alert.css | sweet-alert.min.js | jquery.sweet-alert.init.js |
bootstrap-tagsinput | bootstrap-tagsinput.css | bootstrap-tagsinput.min.js | jquery.form-advanced.init.js |
bootstrap-touchspin | jquery.bootstrap-touchspin.min.css | jquery.bootstrap-touchspin.min.js | jquery.form-advanced.init.js |
bootstrap-timepicker | bootstrap-timepicker.min.css | bootstrap-timepicker.js | - |
bootstrap-xeditable | bootstrap-editable.css | bootstrap-editable.min.js | - |
clockpicker | bootstrap-clockpicker.min.css | bootstrap-clockpicker.min.js | - |
chart.js | - | chart.min.js | jquery.chartjs.init.js |
chartist | chartist.min.css | chartist.min.js | jquery.chartist.init.js |
countdown | - | jquery.countdown.min.js | - |
counterup | - | jquery.counterup.min.js | - |
custombox | custombox.min.css | custombox.min.js | legacy.min.js |
datatables | dataTables.bootstrap4.min.css, buttons.bootstrap4.min.css, responsive.bootstrap4.min.css | jquery.dataTables.min.js, dataTables.bootstrap4.min.js, dataTables.buttons.min.js, buttons.bootstrap4.min.js, jszip.min.js, pdfmake.min.js, vfs_fonts.js, buttons.html5.min.js, buttons.print.min.js, buttons.colVis.min.js, dataTables.responsive.min.js, responsive.bootstrap4.min.js | - |
flot-chart | - | jquery.flot.js, jquery.flot.crosshair.js, jquery.flot.pie.js, jquery.flot.resize.js, jquery.flot.selection.js, jquery.flot.stack.js, jquery.flot.time.js, jquery.flot.tooltip.min.js | jquery.flot.init.js |
fullcalendar | fullcalendar.min.css | fullcalendar.min.js | jquery.fullcalendar.js |
gmaps | - | gmaps.min.js | jquery.gmaps.js |
jquery.steps | jquery.steps.css | jquery.steps.min.js | jquery.wizard-init.js |
jquery-knob | - | jquery.knob.js | - |
jquery-quicksearch | - | jquery.quicksearch.js | - |
jquery-sparkline | - | jquery.sparkline.min.js | - |
jquery-ui | jquery-ui.css | jquery-ui.min.js | - |
jvectormap | jquery-jvectormap-2.0.2.css | jquery-jvectormap-2.0.2.min.js, gdp-data.js, jquery-jvectormap-asia-mill.js, jquery-jvectormap-au-mill.js, jquery-jvectormap-ca-lcc.js, jquery-jvectormap-de-mill.js, jquery-jvectormap-europe-mill-en.js, jquery-jvectormap-in-mill.js, jquery-jvectormap-in-mill.js, jquery-jvectormap-us-aea-en.js, jquery-jvectormap-us-il-chicago-mill-en.js, jquery-jvectormap-world-mill-en.js | jvectormap.init.js |
jquery-mapael | raphael-min.js, jquery.mapael.min.js, world_countries.min.js, usa_states.min.js | jquery.mapael-map.init.js | |
jquery-toastr | jquery.toast.min.css | jquery.toast.min.js | jquery.toastr.js |
moment | - | moment.js | - |
morris | morris.css | morris.min.js | morris.init.js |
parsleyjs | - | parsley.min.js | - |
peity | - | jquery.peity.min.js | - |
raphael | - | raphael-min.js | - |
responsive-table | rwd-table.min.css | rwd-table.min.js | - |
select2 | select2.css | select2.min.js | - |
summernote | summernote.css | summernote.min.js | - |
switchery | switchery.min.css | switchery.min.js | - |
sweet-alert | sweetalert2.min.css | sweetalert2.min.js | jquery.sweet-alert.init.js |
tablesaw | tablesaw.css | tablesaw.js, tablesaw-init.js | - |
tagsinput | jquery.tagsinput.css | jquery.tagsinput.min.js | - |
tinymce | - | tinymce.min.js | |
tiny-editable | - | numeric-input-example.js, mindmup-editabletable.js | |
waypoints | - | jquery.waypoints.min.js | - |
We've used the following resources as listed. These are some awesome creation and we are thankful to the community.
Once again thank you for your purchase. I'll be happy to answer the the questions you have related to the theme. In case if you have any suggestion or feature, request please feel free to contact me, I'll try to implement it and will release as part of future updates.
Stay Awesome!
- Coderthemes
Version 1.3.0 20 Oct 2018
Version 1.2.0 01 May 2018
Version 1.1.0 05 Feb 2018
Version 1.0.0 11 Jan 2018
© 2018 Coderthemes.